<div class="searchbox" id="searchbox-{$widget_data.uniqueid}">
  <div class="content webkit-box">
    <div class="lp">
      <a href="javascript:;" class="iconfont icon-saoyisao"></a>
    </div>
    <div class="mp flex1 webkit-box pl10 gray">
      <i class="iconfont icon-sousuo" style="margin-top:1px;"></i>
      <span class="line-clamp-2 fs13 pl5 keyword">{$widget_data.keyword|default:'搜索'}</span>
    </div>
    <div class="rp">
      <a href="javascript:;" class="iconfont icon-duihua"></a>
    </div>
  </div>
</div>
<style>
  .searchbox .content {
    padding: 0 10px;
    text-align: center;
    align-items:center;
    justify-content:center;
  }

  .searchbox .content .mp {
    height: 32px;
    line-height: 32px;
    border-radius: 20px;
    background: #ffffff;
    color: #999999;
    overflow: hidden;
  }

  .searchbox .content a {
    color: #ffffff;
    display: inline-block;
    border-radius: 25px;
    width: 38px;
    height: 38px;
    line-height: 38px;
    top: 0px;
    text-align: center;
    font-size: 22px;
  }
</style>
<script>
  $(function () {
  
    $('#searchbox-{$widget_data.uniqueid}').css('background-color', '{$widget_data.bgcolor|default:"#fc2b34"}');
    $('#searchbox-{$widget_data.uniqueid}').css('padding', '{$widget_data.space|default:5}px 0');
   
    /* {if $widget_data.iconcolor} */
    $('#searchbox-{$widget_data.uniqueid} .content .lp .iconfont, #searchbox-{$widget_data.uniqueid} .content .rp .iconfont').css('color', '{$widget_data.iconcolor}');
    /* {/if} */

    /* {if $widget_data.iconhide} */
    $('#searchbox-{$widget_data.uniqueid} .content .lp .iconfont, #searchbox-{$widget_data.uniqueid} .content .rp .iconfont').css('display', 'none');
    /* {/if} */

    /* {if $widget_data.boxstyle eq 'square'} */
    $('#searchbox-{$widget_data.uniqueid} .content .mp').css('border-radius', 0);
    /* {/if} */

    /* {if $widget_data.boxcolor} */
    $('#searchbox-{$widget_data.uniqueid} .content .mp').css('background-color', '{$widget_data.boxcolor}');
    /* {/if} */

    /* {if $widget_data.txtcolor} */
    $('#searchbox-{$widget_data.uniqueid} .content .mp').css('color', '{$widget_data.txtcolor}');
    /* {/if} */

    /* {if $widget_data.position eq 'center'} */
    $('#searchbox-{$widget_data.uniqueid} .content .mp').css('justify-content', 'center');
    /* {/if} */
  });
</script>